.dateRangePicker {
    width: 426px!important;
    height: 28px!important;
    .el-range-input{
        color: var(--eq-font-color);
        font-size: 12px;
        height: 28px;
        line-height: 28px;
    }  
    .el-range__icon{
        color: var(--eq-font-color);
    }
    .el-range-separator{
        color: var(--eq-font-color);
        font-size: 12px;
    }
    
} 

.eq-date-range-popper{
    .el-picker-panel{
        background-color: var(--eq-bg-color2);
        .el-picker-panel__sidebar{
            background-color: var(--eq-bg-color2);
            border-right: 1px solid var(--eq-border-color);
            .el-picker-panel__shortcut{
                color: var(--eq-font-color);
                &:hover{
                    color: var(--eq-module-color);
                }
            }
        }
        .el-picker-panel__body{
            .el-date-range-picker__header{
                color: var(--eq-font-color);
                .el-picker-panel__icon-btn{
                    color: var(--eq-font-color);
                }
            }
            .el-date-range-picker__content.is-left{
                border-right: 1px solid var(--eq-border-color);
            }
            .el-date-table th{
                color: var(--eq-font-color);
                border-bottom: 1px solid var(--eq-border-color);
            }
            .el-date-table tr .available{
                color: var(--eq-font-color);
                &:hover{
                    color: var(--eq-module-color);
                }
            }
            .el-date-table tr .in-range div{
                background-color: var(--eq-bg-color3);
            }
            .el-month-table td .cell{
                color: var(--eq-font-color);
                &:hover{
                    color: var(--eq-module-color);
                }
            }
            .el-month-table td.in-range div{
                background-color: var(--eq-bg-color3);
            }
            .el-month-table td.current:not(.disabled) .cell{
                background-color: var(--eq-module-color);
                color: var(--eq-tree-checkbox-bg-color);
                font-weight: bold;
            }
            .el-date-picker__header-label{
                color: var(--eq-font-color);
            }
            .el-picker-panel__icon-btn{
                color: var(--eq-font-color);
            }
            .el-date-picker__header--bordered{
                border-bottom: 1px solid var(--eq-border-color);
            }
        }
    }
}
